<template>
  <div>
    {{ hello }}
    {{ name }}
    <el-button>
      e
    </el-button>
    <el-upload class="upload" :action="this.$baseUrl + '/upload'" accept=".jpg,.png" :data="{folder:'image'}"
               :show-file-list="false"
               :on-success="uploadImage">
      <!--      <el-avatar :size="100" :src="form.imagePath" shape="circle" fit="scale-down" class="user-image">暂无头像-->
      <!--      </el-avatar>-->
      <el-button>
        上传图片
      </el-button>
    </el-upload>
    <el-card>
      <el-image :src="imageUrl"/>
    </el-card>
    <el-upload class="upload" :action="this.$baseUrl + '/upload'" accept=".txt,.doc,.md" :data="{folder:'txt'}"
               :show-file-list="false"
               :on-success="uploadTxt">
      <!--      <el-avatar :size="100" :src="form.imagePath" shape="circle" fit="scale-down" class="user-image">暂无头像-->
      <!--      </el-avatar>-->
      <el-button>
        上传文件
      </el-button>
    </el-upload>
    <el-card>
      {{}}
    </el-card>
  </div>
</template>

<script>
export default {
  name: "index",
  created() {
    //防止刷新丢失数据
    if (sessionStorage.getItem('store')) {
      this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(sessionStorage.getItem('store'))))
    }
    window.addEventListener('beforeunload', () => {
      sessionStorage.setItem('store', JSON.stringify(this.$store.state))
    })

    this.name = this.$store.getters.name

    this.$axios.post('/1').then((res) => {
      this.hello = res.data
    });
  },
  data() {
    return {
      hello: '',
      name: '',
      imageUrl: ''
    }
  },
  methods: {
    uploadImage(file, fileList) {
      this.$axios.get('/get', {
        params: {
          'path': file.toString()
        }
      }).then((res) => {
        console.log(res.data)
        this.imageUrl = res.data
      });
    },
    uploadTxt(file, fileList) {
      this.$axios.get('/get', {
        params: {
          'path': file.toString()
        }
      }).then((res) => {
        console.log(res.data)
      });
    }
  }
}
</script>

<style scoped>

</style>
